<template>
    <div>
        <Header />
        <el-container class="container">
            <el-main class="main">
                <div class="frontend-infos ">
                    <div class="p15">
                        <el-table :data="tableData" size="large" style="width: 100%">
                            <el-table-column prop="title" label="岗位名称" width="180" />
                            <el-table-column prop="cpmpany_name" label="招聘公司" width="180" />
                            <el-table-column prop="location" label="工作地点" />
                            <el-table-column prop="salary_type" label="薪资类型" width="180" />
                            <el-table-column prop="salary_min" label="最低薪资" />
                            <el-table-column prop="salary_max" label="最高薪资" />
                        </el-table>
                    </div>
                </div>
            </el-main>
        </el-container>
        <Footer />
    </div>
</template>

<script setup lang="ts">
import Header from '@/components/header.vue'
import Footer from '@/components/footer.vue'

import { onMounted, ref } from 'vue'
import http from '../../util/request'

const form = ref<any>({search:'',page:0,pageSize:12,total:0})

interface Item {
    id:number,
    title:string
    cpmpany_name:string
    salary_type:string
    department:string
    location:string
    salary_min:number
    salary_max:number
}

const tableData = ref<Item[]>([]);

const onGetData = () => {
    http.post('/hire',form.value).then((response:any)=>{
        tableData.value = response.data.data
        form.value.total = response.data.total
    })
}


onMounted(()=>{
    onGetData()
})

</script>

<style scoped lang="scss">
.main {
    padding: 0px;
}
</style>
